<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<link rel="stylesheet" href="https://cache.amap.com/lbs/static/main.css" />
		<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.6&key=54d5f690cb5787f6b2c9b78c8e6948ad"></script>
		<script type="text/javascript" src="https://webapi.amap.com/demos/js/liteToolbar.js"></script>
		<title></title>
	</head>

	<body>
		<div id="mapContainer">
		</div>
		<div id="tip">
			信息窗体可想在什么地方打开就在什么地方打开
		</div>
		<div class="button-group">
		    <input type="button" class="button" value="打开信息窗体" onClick="javascript:openInfo()"/>
		    <input type="button" class="button" value="关闭信息窗体" onClick="javascript:infoWindow.close()"/>
		</div>
	</body>
	<script type="text/javascript">
		var infoWindow;
		//初始化地图对象，加载地图
		////初始化加载地图时，若center及level属性缺省，地图默认显示用户当前城市范围
		var map = new AMap.Map('mapContainer', {
			resizeEnable: true
		});
		//地图中添加地图操作ToolBar插件
		map.plugin(['AMap.ToolBar'], function() {
			//设置地位标记为自定义标记
			var toolBar = new AMap.ToolBar();
			map.addControl(toolBar);
		});
		map.setZoomAndCenter(14, [116.205467, 39.907761]);
		// 创建一个 Marker 实例：
		var marker = new AMap.Marker({
			map: map,
			position: new AMap.LngLat(116.205467, 39.907761), // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
			title: '北京'
		});
		marker.setAnimation('AMAP_ANIMATION_BOUNCE');
		//在指定位置打开信息窗体
		function openInfo() {
			//构建信息窗体中显示的内容
			var info = [];
			var pixel = new AMap.Pixel(0,-50);
			info.push("<div><div><img style=\"float:left;\" src=\" http://localhost:8080/zero2/css/images/autonavi.png \"/></div> ");
			info.push("<div style=\"padding:0px 0px 0px 4px;\">");
			info.push("定位来源 : 中交兴路定位");
			info.push("2018-07-05 18:44:21")
			info.push("经度：39.907761 纬度：116.205467");
			info.push("地址 :北京市朝阳区望京阜荣街10号首开广场</div></div>");
			infoWindow = new AMap.InfoWindow({
				content: info.join("<br/>"), //使用默认信息窗体框样式，显示信息内容
				offset:pixel
			});
			infoWindow.open(map, map.getCenter());
		}
		
		 map.on('complete', function() {
	        openInfo();
	    });
	</script>

</html>